<template>
  <div>
    <!-- 项目基本情况 -->
    <div v-if="index==1">
      <a-tag color="orange">当前页需要申报单位盖章</a-tag>
    </div>
    <projectInfoForm v-if="index == 1" />
    <!-- 项目简介 and 主要技术创新点 -->
    <projecBrief v-if="index == 2 || index == 3" :data="twoFormData" />
    <!-- 项目详细内容 -->
    <div v-if="index == 4">
        <a-tag color="orange" @click="getInfoByIndex(4)">
          点击查看申报要求
        </a-tag>
    </div>
    <tinymce
      v-if="index == 4"
      class="projectInfo"
      v-model="$store.state.declare.content"
      :key="tinymceFlag"
      :disabled="$store.state.iptDis"
      id="myedit"
      ref="Tinymce"
    />
    <!-- 本项目管获科技奖助情况 -->
    <projectRewarded v-if="index == 5" :mainList="list" />
    <!-- 主要完成人情况表 -->
    <div v-if="index == 6">
      <a-tag color="orange" @click="getInfoByIndex(6)">
        当前页需要完成人本人签名
      </a-tag>
      <principalAccomplisher
        v-for="(i, k) in user"
        :key="k"
        :user="i"
      ></principalAccomplisher>
      <a-button
        type="primary"
        class="marT20"
        block
        @click="addForm('user', 'proDoneUsersList')"
        v-if="!$store.state.iptDis"
        v-show="user.length <= 9"
      >
        新增完成人
      </a-button>
      <div v-if="user.length > 9" class="addUserTip">
        <span class="tips_info">最多只能添加10位完成人</span>
      </div>
    </div>
    <!-- 主要完成单位情况表 -->
    <div v-if="index == 7">
      <a-tag color="orange" @click="getInfoByIndex(7)">
        第几完成单位请用中文汉字一二三表示,并加盖公章
      </a-tag>
      <unitIs v-for="(i, k) in unit" :key="k" :unit="i" />
      <a-button
        type="primary"
        class="marT20"
        block
        @click="addForm('unit', 'proDoneOrgList')"
        v-if="!$store.state.iptDis"
        v-show="unit.length <= 4"
      >
        新增完成单位
      </a-button>
      <div v-if="unit.length > 4" class="addUserTip">
        <span class="tips_info">最多只能添加5个单位</span>
      </div>
    </div>
    <!-- 推荐单位意见 :当做附件上传-->
    <!-- <projecBrief v-if="index == 8" :data="formData8">
      <div class="marT30 flexRight commonSeal" slot="main">
        <div class="fontS16">推荐单位公章</div>
        <div class="fontS16 marT10">年 月 日</div>
      </div>
    </projecBrief> -->
    <!-- 主要证明目录 -->
    <mainProof v-if="index == 9"/>
    <!-- 专家鉴定意见和专家名单 -->
    <!-- <commentsList v-if="index == 10" /> -->
    <!-- 附件预览 -->
    <AffixList
      ref="file"
      v-if="index == 99"
      class="marT20"
      v-on="$listeners"
      :listType2="listType"
      :fileIds2="fileIds"
      @fatherMethod="getlistType"
    />
    <!-- 展示抽屉消息 -->
    <a-drawer
      :visible="drawer_status"
      class="custom-class"
      title="项目详细资料填写说明"
      :width="drawer_size"
      placement="right"
      @close="close_drewer"
    >
    
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&ldquo;项目详细内容&rdquo;应当按照《安徽省广播影视科技创新奖申报书》规定的栏目内容及本说明的有关要求，详实、准确、全面地填写。要求如下：</span></span></p>
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&nbsp;&nbsp;&nbsp;&nbsp;1.&ldquo;立项背景&rdquo;应简明扼要地概述立项时国内外相关科学技术状况、主要技术经济指标、尚待解决的问题及立项目的。要求不超过800 字。</span></span></p>
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&nbsp;&nbsp;&nbsp;&nbsp;2.&ldquo;详细技术内容&rdquo;是评审中的主要参考内容，凡涉及该项目技术实质内容的说明、论证及实验结果等，均应直接叙述，一般不应采取见**附件的表达形式，必要的图示就近插入相应的正文中，不宜另附。该栏目应对推荐项目的总体思路、技术方案、实施效果等进行全面阐述：</span></span></p>
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&nbsp;&nbsp;&nbsp;&nbsp;①高新技术研究与开发类项目应从技术先进性、技术创新程度、技术难度、应用价值和社会经济效益等方面陈述项目相关情况。</span></span></p>
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&nbsp;&nbsp;&nbsp;&nbsp;②科技成果应用与技术革新类项目应从技术先进性、系统创新水平、应用价值和社会经济效益等方面陈述项目相关情况。</span></span></p>
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&nbsp;&nbsp;&nbsp;&nbsp;③工程技术奖类项目应从技术先进性、系统创新水平、工程复杂程度和社会经济效益等方面陈述项目相关情况。</span></span></p>
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&nbsp;&nbsp;&nbsp;&nbsp;3.&ldquo;与当前国内外同类技术主要参数、效益、市场竞争力的比较&rdquo;应就申报项目的总体科学技术水平、主要技术经济指标与当前国内外最先进的同类技术以图表方式进行全面比较，同时加以综合叙述，并指出存在的问题及采取哪些改进措施。要求不超过2页。</span></span></p>
    <p style="text-align: left;"><span style="font-size: 12pt;"><span style="font-family: 仿宋_GB2312;">&nbsp;&nbsp;&nbsp;&nbsp;4.&ldquo;应用情况&rdquo;应就推荐项目的生产、应用、推广情况及预期应用前景等进行阐述。</span></span></p>
    <p style="text-align: left;"><span style="font-family: 仿宋_GB2312; font-size: 12pt;">&nbsp;&nbsp;&nbsp;&nbsp;5.&ldquo;经济效益和社会效益&rdquo;指申报项目在推动科学技术进步，保护自然资源或生态环境，提高国防能力，保障国家和社会安全，改善人民物质文化生活及健康水平等方面所起的作用。产生的经济效益应以主要生产、应用单位财务部门核准的数额为基本依据，还应描述新增直接效益。</span></p>
    </a-drawer>
  </div>
</template>

<script>
import Tinymce from "@/components/tinymce/tinymce.vue"; // 富文本
import projectInfoForm from "@/components/form/projectInfoForm.vue";
import projecBrief from "@/components/form/projectBrief.vue";
import principalAccomplisher from "@/components/form/principalAccomplisher.vue";
import projectRewarded from "@/components/form/projectRewarded.vue";
import unitIs from "@/components/form/unitIs.vue";
import mainProof from "@/components/form/mainProof.vue";
import commentsList from "@/components/form/commentsList.vue";
import AffixList from "@/views/highVideoReport/components/AffixList2.vue";
import { listType, details } from "../../api/index";
import {
  formData2,
  formData3,
  formData4,
  formData8,
} from "@/assets/js/projectInfoFormData.js";
// import { ByInstanceId } from "@/api";
import { mapState } from "vuex";
import { handleTree } from "../../utils/handleTree";
export default {
  components: {
    projectInfoForm,
    projecBrief,
    principalAccomplisher,
    projectRewarded,
    unitIs,
    mainProof,
    // eslint-disable-next-line vue/no-unused-components
    commentsList,
    AffixList,
    Tinymce,
  },
  props: {
    index: {
      type: [Number, String],
      default: () => 0,
    },
    id: {
      type: [Number, String],
      default: () => null,
    },
    basrId: String,
  },
  computed: {
    twoFormData() {
      return this.index == 2 ? formData2 : formData3;
    },
    ...mapState({
      unit: (state) => state.declare.proDoneOrgList,
      user: (state) => state.declare.proDoneUsersList,
      list: (state) => state.declare.proPrizeHisList,
    }),
  },
  data() {
    return {
      formData4,
      formData8,
      // 是否显示弹出层
      open: false,
      tinymceFlag: 1, //是防止组件缓存导致编辑器不能正常使用，每次切换来都更改key,使其重新渲染
      isflielist: [],
      listType: [],
      fileIds: [],
      drawer_status: false, // 抽屉弹出层，显示项目详细内容的申报要求
      drawer_size: "600px"
    };
  },
  mounted() {
    console.log(this.basrId, "basrid");
    console.log(this.index);
  },
  created() {
    this.getdetail();
    if (this.list.length >= 7) return;
    for (let index = 0; index < 7; index++) {
      let obj = {
        deptName: "", // 授奖部门（单位）
        getTime: "", //获奖时间
        prizeLevel: "", // 奖项等级
        prizeName: "", // 奖项名称
      };
      this.list.push(obj);
    }
  },
  beforeDestroy() {
    // 销毁组件前销毁编辑器
    this.tinymce && this.tinymce.destroy();
  },
  activated() {
    // 每次都给编辑器改变不同的key值使其每次切换页面都重新加载
    console.log("--->", this.tinymceFlag);
    this.tinymceFlag++;
  },
  methods: {
    close_drewer(){
      this.drawer_status = false
    },
    getInfoByIndex(i){
      if(i==4){
        this.drawer_status = true
      }
    },
    addForm(type, params) {
      let declare = JSON.parse(sessionStorage.getItem("declare"));
      this[type].push(declare[params][0]);
    },
    getdetail() {
      details(this.basrId).then((res) => {
        console.log(res, "这是总的附件列表");
        if (res.code == 200) {
          this.isflielist = res.data.fileList;
          for (let index = 0; index < res.data.fileList.length; index++) {
            const element = res.data.fileList[index];
            this.fileIds.push(element.id);
          }
          this.getlistType();
        } else {
          this.getlistType();
        }
        // chil.proGoldDeerPlay2 = res.data.proGoldDeer.proGoldDeerPlay;
        // this.baseNametop = res.data.baseName;
        // this.baseId = res.data.baseId;
        // chil.gain();
      });
    },
    getlistType() {
      listType({
        prizeType: 1,
      }).then((res) => {
        console.log(res.data, "附件列表");
        console.log(handleTree(res.data, "id"), "附件数据");
        this.listType = handleTree(res.data, "id");

        console.log(this.isflielist);
        if (this.isflielist.length != 0) {
          for (let index1 = 0; index1 < this.listType.length; index1++) {
            // const element = this.listType[index];
            for (
              let index2 = 0;
              index2 < this.listType[index1].children.length;
              index2++
            ) {
              // const element = this.listType[index].children[index];
              for (let index3 = 0; index3 < this.isflielist.length; index3++) {
                // const element = this.affixList[index];
                if (
                  this.listType[index1].children[index2].id ==
                  this.isflielist[index3].typeId
                ) {
                  this.listType[index1].children[index2].children.push(
                    this.isflielist[index3]
                  );
                }
              }
            }
          }
        }
        // this.$refs.file.listType = this.listType
        console.log(this.listType, "listTypelistTypelistType");
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.commonSeal {
  flex-direction: column;
  // justify-content: flex-end;
  align-items: flex-end;
}
.projectInfo {
  margin-top: 20px;
}
.addUserTip {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  .tips_info {
    color: red;
  }
}
</style>